<template>
  <div class="h100   ecuVersionConfigInfo" ref="groupInfoTableList">
    <s-table
      class="h100"
      :columns="columns"
      :scrollX="1000"
      :dataSource="ecuVersionLists"
      :showPagination="false"
      :loading="loading"
      :rowKey="(record) => record.ecuId">
      <!-- 自定义依赖分组列 -->
      <span slot="dependentGroupingColumn">
        {{ $t('dependentGrouping') }}
        <question-mark-tip
          :tip-title="$t('dependentGroupingColumnTip')"
          :popupContainer="getPopupContainerColumn"
        ></question-mark-tip>
      </span>
      <!-- 自定义是否回滚列 -->
      <span slot="isRollbackColumn">
        {{ $t('isRollback') }}
        <question-mark-tip
          :tip-title="$t('isRollbackColumnTip')"
          :popupContainer="getPopupContainerColumn"
        ></question-mark-tip>
      </span>
      <!-- 自定义升级顺序列 -->
      <span slot="updateOrderColumn">
        {{ $t('updateOrder') }}
        <question-mark-tip
          :tip-title="$t('updateOrderColumnTip')"
          :popupContainer="getPopupContainerColumn"
        ></question-mark-tip>
      </span>
      <template
        slot-scope="text"
        v-for="column in commonColumns"
        :slot="column.scopedSlots.customRender"
      >
        <table-ellipsis :text="text || '-'" :key="column.dataIndex"></table-ellipsis>
      </template>
      <template slot="versionDesc" slot-scope="text,record">
        <a @click="showVersionDesc(record.releaseNotes)" v-if="record.releaseNotes">{{ $t('view') }}</a>
        <span v-else>-</span>
      </template>
      <template slot="ecuVersion" slot-scope="text,record">
        <table-ellipsis :text="record.versionName || '-'"></table-ellipsis>
      </template>
      <template slot="wholePackageCount" slot-scope="text, record">
        <span v-if="record.wholePackageCount">{{ $t('uploaded') }}</span>
        <span v-else>{{ $t('noUploaded') }}</span>
      </template>
      <template slot="configFileVersion" slot-scope="text,record">
        <table-ellipsis :text="record.configVersionName || '-'"></table-ellipsis>
      </template>
      <template slot="dependentGrouping" slot-scope="text,record">
        <table-ellipsis :text="record.groupNo || '-'"></table-ellipsis>
      </template>
      <template slot="updateOrder" slot-scope="text,record">
        <table-ellipsis :text="record.groupUpgradeNo || '-'"></table-ellipsis>
      </template>
      <template slot="isRollback" slot-scope="text,record">
        <table-ellipsis :text="record.groupRollback === true ? $t('rollbackYes') : (record.groupRollback === false ? $t('rollbackNo') : '')"></table-ellipsis>
      </template>
    </s-table>
    <!-- 发布说明弹框组件 -->
    <view-release-note
      ref="releaseNoteRef"
      :width="600"
      :releaseNotes="releaseNotes || {}"
      :is-edit="false"
    ></view-release-note>
  </div>
</template>
<script>
import { ecuVersionConfigColumns } from '../config/list'
import QuestionMarkTip from '@/views/components/QuestionMarkTip'
import tableEllipsis from '@/components/Ellipsis/TableEllipsis'
import ViewReleaseNote from '@/views/components/ViewReleaseNote'
import { STable } from '@/components'
export default {
  components: {
    tableEllipsis,
    QuestionMarkTip,
    ViewReleaseNote,
    STable
  },
  props: {
    ecuVersionLists: {
      type: Array,
      default () {
        return []
      }
    },
    loading: {
      type: Boolean,
      default: false
    }
  },
  computed: {
    commonColumns () {
      return this.columns.filter(item => !item.special)
    }
  },
  data () {
    return {
      columns: ecuVersionConfigColumns,
      releaseNotes: null
    }
  },
  watch: {
  },
  created () {
    this.$store.dispatch('getVersionTypeDictCodeData')
  },
  mounted () {
  },
  methods: {
    getPopupContainerColumn () {
      return document.body
    },
    // 查看版本描述
    showVersionDesc (releaseNotes) {
      this.releaseNotes = releaseNotes
      this.$refs.releaseNoteRef.toggleVisible(true)
    }
  }
}
</script>
